// components/test/test.js
const behavior = require('../../behaviors/my-behavior')
// 步骤一：引入store实例
import {storeBindingsBehavior} from 'mobx-miniprogram-bindings'
import {store} from '../../store/store'
Component({
  //将数据挂载到behaviors数组节点中，可以导入多个behavior进行使用
  // 步骤二：将storeBindingsBehavior引入behavior中
  behaviors:[behavior,storeBindingsBehavior],
  // 步骤三：映射数据源
  storeBindings:{
    // 数据源
    store,
    fields:{
      numA:"numA",
      numB:'numB',
      sum:"sum"
    },
    actions:{
      updateNum2:'updateNum2'
    }
  },
  /**
   * 组件的属性列表，存储接收到的数据值，对properties中的数据进行修改还是使用this.setData实现，和data数据一样都是可读可写的
   */
  // 父子组件通信方式之一：属性绑定，通过properties获取
  properties: {
    name:String,//简化方式
    age:{//可设置默认值的声明方式
      type:Number,
      value:20,
    }
  },
  /**
   * 组件的初始数据
   */
  data: {

  },

  /**
   * 组件的方法列表
   */
  methods: {
    //触发父组件传送的自定义事件
    tapOne(){
      this.triggerEvent('one',{
        name:'张三',
        age:22
      })
    },
    //对numB进行--操作
    deduceNumb(e){
      const step = e.target.dataset.info
      //操作store里面的数据只能通过调用store里面的函数进行修改
      this.updateNum2(step)
    }
  },
  // 数据监听器，监听数据变化
  observers:{
    // 可同时监听多个数据的变化
    'name,age':(newName,newAge)=>{
      console.log(newName,newAge)
    },
  },
  // 生命周期函数
  lifetimes:{
    created(){
      console.log('created~~~~')
    },
    // 页面初次渲染后执行，已经可以调用this.setData设置数据了，常用
    attached(){
      console.log('attached~~~~')
    },
    //页面销毁时触发
    detached(){
      console.log('detached~~~~')
    }
  },
  // 页面生命周期函数
  pageLifetimes:{//监听寄生页面的生命周期，只有这三个可以监听
    show(){//页面被展示
      console.log('show')
    },
    hide(){//页面被隐藏
      console.log('hide')
    },
    resize(){//页面尺寸变化
      console.log('resize')
    }
  },
})